<!DOCTYPE html>
<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<head>
<meta charset="utf-8">
<title>Shifter - Responsive HTML5 Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="shortcut icon" href="images/favicon.gif"/>
<link rel="stylesheet" href="css/style.css" media="screen"/><!-- MAIN STYLE CSS FILE -->
<link rel="stylesheet" href="css/responsive.css" media="screen"/><!-- RESPONSIVE CSS FILE -->
<link rel="stylesheet" id="style-color" href="css/colors/blue-color.css" media="screen"/><!-- DEFAULT BLUE COLOR CSS FILE -->
<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,700,500' rel='stylesheet' type='text/css'><!-- ROBOTO FONT FROM GOOGLE CSS FILE -->
<link rel="stylesheet" href="css/prettyPhoto.css" media="screen"/><!--PRETTYPHOTO CSS FILE -->
<link rel="stylesheet" href="css/font-awesome/font-awesome.min.css" media="screen"/><!-- FONT AWESOME ICONS CSS FILE -->
<link rel="stylesheet" href="css/layer-slider.css" media="screen"/><!-- LAYER SLIDER CSS FILE -->
<link rel="stylesheet" href="css/flexslider.css" media="screen"/><!-- FLEX SLIDER CSS FILE -->
<link rel="stylesheet" href="css/revolution-slider.css" media="screen"/><!-- REVOLUTION SLIDER CSS FILE -->
<!-- All JavaScript Files (FOR FASTER LOADING OF YOUR SITE, REMOVE ALL JS PLUGINS YOU WILL NOT USE)-->
<script type="text/javascript" src="js/jquery.min.js"></script><!-- JQUERY JS FILE -->
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script><!-- JQUERY UI JS FILE -->
<script type="text/javascript" src="js/flex-slider.min.js"></script><!-- FLEX SLIDER JS FILE -->
<script type="text/javascript" src="js/navigation.min.js"></script><!-- MAIN NAVIGATION JS FILE -->
<script type="text/javascript" src="js/jquery.layerslider.js"></script><!-- LAYER SLIDER JS FILE -->
<script type="text/javascript" src="js/layerslider.transitions.js"></script><!-- LAYER SLIDER TRANSITIONS JS FILE -->
<script type="text/javascript" src="js/map.min.js"></script><!-- GOOGLE MAP JS FILE -->
<script type="text/javascript" src="js/carousel.js"></script><!-- CAROUSEL SLIDER JS -->
<script type="text/javascript" src="js/jquery.theme.plugins.min.js"></script><!-- REVOLUTION SLIDER PLUGINS JS FILE -->
<script type="text/javascript" src="js/jquery.themepunch.revolution.min.js"></script><!-- REVOLUTION SLIDER JS FILE -->
<script type="text/javascript" src="js/flickr.js"></script><!-- FLICKR WIDGET JS FILE -->
<script type="text/javascript" src="js/instagram.js"></script><!-- INSTAGRAM WIDGET JS FILE -->
<script type="text/javascript" src="js/jquery.twitter.js"></script><!--TWITTER WIDGET JS FILE -->
<script type="text/javascript" src="js/prettyPhoto.min.js"></script><!-- PRETTYPHOTO JS FILE -->
<script type="text/javascript" src="js/jquery.tooltips.min.js"></script><!-- TOOLTIPS JS FILE -->
<script type="text/javascript" src="js/isotope.min.js"></script><!--ISOTOPE JS FILE -->
<script type="text/javascript" src="js/scrolltopcontrol.js"></script><!-- SCROLL TO TOP JS PLUGIN -->
<script type="text/javascript" src="js/jquery.easy-pie-chart.js"></script><!-- EASY PIE JS FILE -->
<script type="text/javascript" src="js/jquery.transit.min.js"></script><!-- TRANSITION JS FILE -->
<script type="text/javascript" src="js/custom.js"></script><!-- CUSTOM JAVASCRIPT JS FILE -->
</head>
<body>
<div id="container">
	<!-- main container starts-->
	<div id="wrapp">
		<!-- main wrapp starts-->
		<header id="header">
		<!--header starts -->
		<div id="header-links">
			<div class="container">
				<div class="one-half">
					<ul class="contact-links">
						<!-- header social links starts-->
						<li><a href="#"><i class="icon-home"></i>5 Avenue, Some City </a></li>
						<li><a href="#"><i class="icon-phone"></i>+987 654 321 </a></li>
						<li><a href="#"><i class="icon-map-marker"></i>mail@yoursite.com</a></li>
					</ul>
				</div>
				<div class="one-half">
					<ul class="social-links">
						<!-- header social links starts-->
						<li><a href="#" class="tooltip" title="Some Title"><i class="icon-twitter"></i></a></li>
						<li><a href="#" class="tooltip" title="Some Title"><i class="icon-facebook"></i></a></li>
						<li><a href="#" class="tooltip" title="Some Title"><i class="icon-linkedin"></i></a></li>
						<li><a href="#" class="tooltip" title="Some Title"><i class="icon-google-plus"></i></a></li>
						<li><a href="#" class="tooltip" title="Some Title"><i class="icon-skype"></i></a></li>
						<li><a href="#" class="tooltip" title="Some Title"><i class="icon-dribbble"></i></a></li>
						<li><a href="#" class="tooltip" title="Some Title"><i class="icon-pinterest"></i></a></li>
						<li><a href="#" class="tooltip" title="Some Title"><i class="icon-tumblr"></i></a></li>
					</ul>
					<!--header social links ends -->
				</div>
			</div>
		</div>
		<div class="container">
			<div class="head-wrapp">
				<a href="index.html" id="logo"><img src="images/logo.png" alt=""/><span>Responsive Business Template</span></a>
				<!--your logo-->
				<nav class="top-search">
				<!-- search starts-->
				<form action="404-error.html" method="get">
					<button class="search-btn"></button>
					<input class="search-field" type="text" onblur="if(this.value=='')this.value='Search';" onfocus="if(this.value=='Search')this.value='';" value="Search"/>
				</form>
				</nav>
				<!--search ends -->
			</div>
		</div>
		<div id="main-navigation">
			<!--main navigation wrapper starts -->
			<div class="container">
				<ul class="main-menu">
					<li><a href="index.html">Home</a>
					<!-- Second Level / Start -->
					<ul>
						<li><a href="index.html">Layer Slider (Default)</a></li>
						<li><a href="home-revolution-slider.html">Revolution Slider</a></li>
						<li><a href="home-flex-slider.html">Flex Slider</a></li>
						<li><a href="home-alternative-header-1.html">Header Style 1</a></li>
						<li><a href="home-alternative-header-2.html">Header Style 2</a></li>
						<li><a href="home-alternative-header-3.html">Header Style 3</a></li>
						 
						<li><a href="#">Menu Second Level</a>
						<ul>
							<li><a href="#">Dummy Item</a></li>
							<li><a href="#">Dummy Item</a></li>
						</ul>
						</li>
					</ul>
					<!-- Second Level / End -->
					</li>
					<li><a href="#" id="current">Mega Menu</a>
					<!-- Mega Menu / Start -->
					<ul class="four-columns">
						<li class="one">
						<h5>Some Pages</h5>
						<ol>
							<li><a href="about-us.html"><i class="icon-group"></i>About Us</a></li>
							<li><a href="services.html"><i class="icon-cog"></i>Services</a></li>
							<li><a href="faq.html"><i class="icon-question-sign"></i>F.A.Q</a></li>
							<li><a href="team-member.html"><i class="icon-user"></i>Team Member</a></li>
						</ol>
						</li>
						<li class="one">
						<h5>Feature Pages</h5>
						<ol>
							<li><a href="left-sidebar.html"><i class="icon-circle-arrow-left"></i>Left Sidebar</a></li>
							<li><a href="right-sidebar.html"><i class="icon-circle-arrow-right"></i>Right Sidebar</a></li>
							<li><a href="404-error.html"><i class="icon-warning-sign"></i>404 Page</a></li>
							<li><a href="clients.html"><i class="icon-quote-left"></i>Clients</a></li>
						</ol>
						</li>
						<li class="one">
						<h5>Elements Pages</h5>
						<ol>
							<li><a href="elements.html"><i class=" icon-cogs"></i>Elements</a></li>
							<li><a href="icons.html"><i class="icon-th-large"></i>Icons</a></li>
							<li><a href="pricing-tables.html"><i class=" icon-table"></i>Pricing Tables</a></li>
							<li><a href="typography.html"><i class="icon-text-height"></i>Typography</a></li>
						</ol>
						</li>
						<li class="one">
						<h5>Portfolio Pages</h5>
						<ol>
							<li><a href="portfolio-2.html"><i class=" icon-lightbulb"></i>2 Columns Portfolio</a></li>
							<li><a href="portfolio-3.html"><i class=" icon-suitcase"></i>3 Columns Portfolio</a></li>
							<li><a href="portfolio-4.html"><i class="icon-heart"></i>4 Columns Portfolio</a></li>
							<li><a href="single-project-small.html"><i class="icon-zoom-in"></i>Single Project</a></li>
						</ol>
						</li>
					</ul>
					<!-- Mega Menu / End -->
					</li>
					<li><a href="#"> Portfolio</a>
					<!-- Second Level / Start -->
					<ul>
						<li><a href="portfolio-2.html">2 Columns Portfolio</a></li>
						<li><a href="portfolio-3.html">3 Columns Portfolio</a></li>
						<li><a href="portfolio-4.html">4 Columns Portfolio</a></li>
						<li><a href="single-project-small.html">Single Project Small</a></li>
						<li><a href="single-project-large.html">Single Project Large</a></li>
					</ul>
					<!-- Second Level / End -->
					</li>
					<li><a href="#">Shortcodes</a>
					<!-- Second Level / Start -->
					<ul>
						<li><a href="columns.html">Columns</a></li>
						<li><a href="typography.html">Typography</a></li>
						<li><a href="elements.html">Elements</a></li>
						<li><a href="icons.html">Icons</a></li>
						<li><a href="pricing-tables.html">Pricing Tables</a></li>
					</ul>
					<!-- Second Level / End -->

					<li><a href="#">Shop</a>
					<!-- Second Level / Start -->
					<ul>
						<li><a href="shop-layout.html">Shop</a></li>
						
						 
					</ul>
					<!-- Second Level / End -->
					</li>
					<li><a href="#"> Blog</a>
					<!-- Second Level / Start -->
					<ul>
						
						<li><a href="blog-small.html">Small Layout</a></li>
						<li><a href="blog-medium.html">Medium Layout</a></li>
						<li><a href="blog-large.html">Large Layout</a></li>
						<li><a href="blog-post.html">Single Post</a></li>
					</ul>
					<!-- Second Level / End -->
					</li>
					<li><a href="contact.html">Contact</a></li>
				</ul>
				<!-- main navigation ends-->
				<div class="after-nav-info">
					<h4>contact phone: +987 654 321 000</h4>
				</div>
			</div>
		</div>
		<!--main navigation wrapper ends -->
		</header>
		<!-- header ends-->
 		<div id="content">
	<div id="breadcrumb">
		<!-- breadcrumb starts-->
		<div class="container">
			<div class="one-half">
				<h4>F.A.Q</h4>
			</div>
			<div class="one-half">
				<nav id="breadcrumbs">
				<!--breadcrumb nav starts-->
				<ul>
					<li>You are here:</li>
					<li><a href="index.html">Home</a></li>
					<li>F.A.Q</li>
				</ul>
				</nav>
				<!--breadcrumb nav ends -->
			</div>
		</div>
	</div>
	<!--breadcrumbs ends -->
	<div class="container">
		<div class="three-fourth">
			<ul class="accordion">
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Do I need to install this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>How To change color version?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Where can i get help with this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>How do i change the contact form?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Do I need to know php?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Where can i get help with this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Where can i get help with this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Where can i get help with this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Where can i get help with this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Where can i get help with this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Where can i get help with this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
				<li class="accordion-item">
				<div class="accordion-switch">
					<span class="togglegfx"></span>Where can i get help with this?
				</div>
				<div class="accordion-content">
					<p>
						 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
					</p>
				</div>
				</li>
			</ul>
		</div>
		<div class="one-fourth sidebar right">
			<div class="widget">
				<h4 class="widget-title">About Our Writing</h4>
				<p>
					 Lorem ipsum dolor sit amet nec, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes. Lorem ipsum dolor sit amet nec, consectetuer adipiscing elit. Aenean commodo ligula eget dolor
				</p>
			</div>
			<div class="widget">
				<h4 class="widget-title">Archive</h4>
				<ul class="sidebar-nav">
					<li><a href="#" title="Some Title">July 2013</a></li>
					<li><a href="#" title="Some Title">June 2013</a></li>
					<li><a href="#" title="Some Title">May 2013</a></li>
					<li><a href="#" title="Some Title">April 2013</a></li>
					<li><a href="#" title="Some Title">March 2013</a></li>
					<li><a href="#" title="Some Title">February 2013</a></li>
					<li><a href="#" title="Some Title">January 2013</a></li>
					<li><a href="#" title="Some Title">December 2012</a></li>
					<li><a href="#" title="Some Title">November 2012</a></li>
				</ul>
			</div>
			<div class="widget">
				<h4 class="widget-title">Popular Tags</h4>
				<ul class="popular-tags">
					<li><a href="#"><i class="icon-tag"></i>AJAX</a></li>
					<li><a href="#"><i class="icon-tag"></i>HTML5</a></li>
					<li><a href="#"><i class="icon-tag"></i>jQuery</a></li>
					<li><a href="#"><i class="icon-tag"></i>CSS3</a></li>
					<li><a href="#"><i class="icon-tag"></i>PHP</a></li>
					<li><a href="#"><i class="icon-tag"></i>Wordpress</a></li>
					<li><a href="#"><i class="icon-tag"></i>Photoshop</a></li>
					<li><a href="#"><i class="icon-tag"></i>Uncategorized</a></li>
					<li><a href="#"><i class="icon-tag"></i>Ruby</a></li>
					<li><a href="#"><i class="icon-tag"></i>Drupal</a></li>
					<li><a href="#"><i class="icon-tag"></i>Inspiration</a></li>
					<li><a href="#"><i class="icon-tag"></i>Joomla</a></li>
					<li><a href="#"><i class="icon-tag"></i>Design</a></li>
					<li><a href="#"><i class="icon-tag"></i>Responsive</a></li>
					<li><a href="#"><i class="icon-tag"></i>Envato</a></li>
					<li><a href="#"><i class="icon-tag"></i>Wallpapers</a></li>
					<li><a href="#"><i class="icon-tag"></i>Fonts</a></li>
				</ul>
			</div>
			<div class="widget">
				<h4 class="widget-title">Flicrk Photos</h4>
				<div class="flickr-widget inner">
				</div>
			</div>
		</div>
		<!-- sidebar ends-->
	</div>
</div>
<section class="footer-call-to-action">
<section class="container">
<div class="three-fourth">
	<h4>If you you’re interested in working with Us, feel free to contact Us via contact form.</h4>
</div>
<div class="one-fourth">
	<a href="#" class="button grey huge round">Purchase Now</a>
</div>
</section>
</section>
<footer id="footer">
<section class="container">
<section class="one-third">
<h4>Twitter Feeds</h4>
<ul class="twitter-feeds">
	<!-- twitter widget starts-->
</ul>
<!-- twitter widget ends-->
<p>
	<a href="#">Follow Me on Twitter</a>
</p>
</section>
<section class="one-third">
<h4>Latest Posts</h4>
<ul>
	<!-- latest posts widget starts-->
	<li><a href="blog-post.html">Free Responsive HTML5 Template.</a></li>
	<li><a href="blog-post.html">PSD Widget UI Free Download</a></li>
	<li><a href="blog-post.html">Free Business Bootsrap Template</a></li>
	<li><a href="blog-post.html">Custom WordPress Themes</a></li>
</ul>
<!-- lastest posts widget ends-->
</section>
<section class="one-third">
<h4>Flickr Photos</h4>
<div class="flickr-widget">
	<!-- flickr widget starts-->
</div>
</section>
</section>
</footer>
<section id="copyrights">
<section class="container">
<div class="one-half">
	<p>
		 Copyright &copy; 2014.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a>
	</p>
</div>
<div class="one-half">
	<ul class="copyright_links">
		<li><a href="#" title="Home">Home</a></li>
		<li><a href="#" title="About">About us</a></li>
		<li><a href="#" title="Blog">Blog</a></li>
		<li><a href="#" title="Contact">Contact</a></li>
	</ul>
</div>
</section>
</section>
</div>
<!-- main wrapp starts-->
</div>
<!-- main container ends-->

</body>
</html>